import "bootstrap";
import "bootstrap/scss/bootstrap.scss";
import "../style/index.scss";
import "normalize.css";
import "@fortawesome/fontawesome-free/js/all";

// import displayState from './demoPage/display';

// console.warn(`mode is: ${process.env.NODE_ENV}`);
// console.warn(displayState); //引入并打印是为了测试共同引用模块的打包
$(function () {
  function banner() {
    let iNow = 0;
    let aImgs = null;
    let aPagiBg = null;
    let timer = setInterval(() => {
      iNow++;
      tab();
      pagination();
    }, 3000);
    tab();
    pagination();

    function tab() {
      if (!aImgs) {
        aImgs = $("#swiper .swiper-container").find("section");
        $(".swiper-container").height(aImgs.height());
      }
      if (iNow === aImgs.length) {
        iNow = 0;
      }
      aImgs.eq(iNow).addClass("active").siblings().removeClass("active");
    }

    function pagination() {
      const $width = 18 / aImgs.length;
      aPagiBg = $(".pagination .pagination-item__bg");
      aPagiBg.css("left", `${$width * iNow}vw`);
    }

    $("#swiper").on("mouseenter", function () {
      window.clearInterval(timer);
    });
    $("#swiper").on("mouseleave", function () {
      timer = setInterval(() => {
        iNow++;
        tab();
        pagination();
      }, 3000);
      tab();
    });
    $(".pagination .pagination-item").on("click", function () {
      iNow = $(this).index();
      tab();
      pagination();
    });
  }
  function productionPictures() {
    $("#production .production-pictures-item").on("mouseenter", function () {
      $(this).find(".item-active").css({
        transform: "translate3d(0,-100%,0)",
      });
    });
    $("#production .production-pictures-item").on("mouseleave", function () {
      $(this).find(".item-active").css({
        transform: "",
      });
    });
  }
  function scrollToHeight() {
    $("footer #footer-nav--wrapper")
      .find(".index")
      .on("click", "li", function () {
        const $scrollName = $(this).attr("class").split(" ")[1];
        const $scrollHeight = $(`#${$scrollName}`).offset().top;
        $('html, body').animate({  
          scrollTop: $scrollHeight
        }, 1500); 
      });

    // console.log($('footer #footer-nav--wrapper').find('.index'));
  }
  banner();
  productionPictures();
  scrollToHeight();
  console.log($("#production").offset().top);
});

$(window).resize(function () {
  const aImgs = $("#swiper .swiper-container").find("section");
  $(".swiper-container").height(aImgs.height());
});

$(document).scroll(function(){
 const $scrollTop = $(document).scrollTop()
 if($scrollTop > 150) {
   $('#header').addClass('scrollStyle')
 } else {
  $('#header').removeClass('scrollStyle')
 }
})
